<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>在线咨询</title>
    <link type="text/css" rel="stylesheet" href="lib/jquery/themes/default/easyui.css">
    <link type="text/css" rel="stylesheet" href="lib/jquery/themes/icon.css">
    <script src="lib/jquery/jquery.min.js"></script>
    <script src="lib/jquery/jquery.easyui.min.js"></script>
</head>
<body>
<style>
    body,html{
        padding: 0;
        margin: 0;
    }
    .center{
        margin-left: calc(50vw - 200px);
    }

</style>
<div class="center" style="width: 400px;margin-top: 50px">
    <div class="easyui-panel" title="在线咨询" cls="panel" style="width:400px;">
        <div style="padding:10px 60px 20px 60px">
            <form id="ff" method="post">
                <table cellpadding="5">
                    <tr>
                        <td>标题:</td>
                        <td><input class="easyui-textbox" type="text" name="name" data-options="required:true,missingMessage:'必填'"></input></td>
                    </tr>
                    <tr>
                        <td>联系电话:</td>
                        <td><input class="easyui-textbox" type="text" name="email"
                                   data-options="required:true,missingMessage:'必填'"></input></td>
                    </tr>
                    <tr>
                        <td>摘要:</td>
                        <td><input class="easyui-textbox" type="text" name="subject" data-options="required:true,missingMessage:'必填'"></input>
                        </td>
                    </tr>
                    <tr>
                        <td>问题:</td>
                        <td><input class="easyui-textbox" name="message" data-options="multiline:true"
                                   style="height:100px"></input></td>
                    </tr>
                    <tr>
                        <td>类型:</td>
                        <td>
                            <select class="easyui-combobox" name="language">
                                <option value="ar">宅基地政策</option>
                                <option value="bg">证书办理</option>
                                <option value="ca">审批流程</option>
                                <option value="zh-cht">宅基地流转</option>
                            </select>
                        </td>
                    </tr>
                </table>
            </form>
            <div style="text-align:center;padding:5px">
                <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()">提交</a>
                <a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()">清除</a>
            </div>
        </div>
    </div>
</div>

<div id="dd" class="easyui-dialog" title="提交" closed="true" style="width:100px;height:80px;line-height: 40px;text-align: center"
     data-options="iconCls:'icon-ok',modal:true,onClose:function(){window.opener=null;window.close()}">
    提交成功
</div>
<script>
    function submitForm() {
        // $('#ff').form('submit');
        $("#dd").dialog('open');

    }

    function clearForm() {
        $('#ff').form('clear');
    }
</script>
</body>
</html>